<template>
  <view class="wrapper row">
    <view class="top">
      <view class="bg"></view>
      <view class="detail pd_t_30 pd_l_30 pd_b_30 row">
        <block>
          <image :src="details.imgUrl" class="school_icon"></image>
        </block>
        <view>
          <view class="title color-333 font-36 font-b pd_b_20">{{details.schoolName}}</view>
          <view class="item row font-28 u-m-b-20 color-666">
            <view class="label">所在地：</view>
            <view>{{details.provinceName || ''}}</view>
          </view>
          <view class="item row font-28 u-m-b-20 color-666">
            <view class="label">教育行政主管部门：</view>
            <view class="color-666">{{details.agencyName || ''}}</view>
          </view>
          <view class="item u-flex u-flex-wrap font-28 u-m-b-20">
            <view class="school_tag font-20 school_tag_0">{{details.schoolType}}</view>
            <view class="school_tag font-20"
                  :class="{
                          school_tag_1: indexs == 0 || indexs > 5,
                          school_tag_2: indexs == 1,
                          school_tag_3: indexs == 2,
                          school_tag_4: indexs == 3,
                          school_tag_5: indexs == 4,
                          school_tag_6: indexs == 5
                        }"
                  :key="indexs"
                  v-if="item != '-'"
                  v-for="(item, indexs) in details.typeId">{{item}}</view>
          </view>
        </view>
      </view>
    </view>
    <view class="empety"></view>
    <swiper @transition="transition" class="swipper-wrp">
      <!--录取分数-->
      <swiper-item class="swiper-item">
        <block v-if="loginFlag">
          <dropMenu :options="options"
                    defautlProvince
                    liandong
                    @choose="chooseBack"
                    :provinceNameData="provinceNameData"
                    :wOrLData="wOrLData"
                    :yearData="yearData"
                    :admissionsTimesData="admissionsTimesData"></dropMenu>
          <scroll-view scroll-y style="height: calc(100% - 60rpx);">
            <view class="table" style="width: 96%;margin: 0 auto">
              <view class="th bg-f2f2f2 row cont-center flex-around">
                <view class="td color-active u-font-sm pd_t_20 pd_b_20 flex-1 u-text-center">专业名称</view>
                <view class="td color-active u-font-sm pd_t_20 pd_b_20 flex-1 u-text-center">平均分</view>
                <view class="td color-active u-font-sm pd_t_20 pd_b_20 flex-1 u-text-center">最低分/位次</view>
              </view>
              <block v-if="showData.length">
                <view v-for="(item, index) in showData" :key="index">
                  <view class="th row cont-center flex-around" :class="{'bg-f2f2f2': index % 2 != 0}">
                    <view class="td flex-1 u-font-sm pd_t_20 pd_b_20 u-text-center">{{item.specialtyName}}</view>
                    <view class="td flex-1 u-font-sm pd_t_20 pd_b_20 u-text-center">{{item.averageScore}}</view>
                    <view class="td flex-1 u-font-sm pd_t_20 pd_b_20 u-text-center">{{item.lowestScore}}/{{item.lowestRank}}</view>
                  </view>
                </view>
              </block>
              <view class="u-font-sm u-text-center u-padding-30" v-if="showData.length == 0">暂无数据</view>
            </view>
            <view class="color-999 text-cent font-20 u-p-b-30 u-p-t-30" v-if="showData.length">数据仅供参考，最终以高校与考试院公布为准！</view>
          </scroll-view>
        </block>
        <view v-else style="height: 100%">
          <go_login></go_login>
        </view>
      </swiper-item>
    </swiper>
  </view>
</template>

<script>
  import {request} from "../../util/api";
  import mixins from "./mixins";
  import dropMenu from '@/components/my_dropmenu/index'
  import go_login from "../../components/go_login";
  import {getCurrentFullPath} from "../../util/util";
  import themeMixins from "../mixins/themeMixins";

  export default {
    mixins: [mixins,themeMixins],
    components: {
      dropMenu,
      go_login
    },
    onLoad(option) {
      this.getList(option.id)
    },
    data() {
      return {
        details: {},
        options: ['provinceName', 'wOrL', 'year', 'admissionsTimes'],
        customStyle: {
          background: '#1F476D'
        },
        admissionsTimesData: [],
        provinceNameData: [],
        wOrLData: [],
        yearData: [],
        showData: [],
      }
    },
    methods: {
      getList(id) {
        request({
          url:'/system/wx/CompassUniversityInfo/' + id,
          token: true,
          errorFn: true
        }).then(res => {
          res.data.typeId = res.data.typeIds.replace(/^\s+|\s+$/g, '').split(" ")
          this.details = res.data
          this.getScoreLine()
        }).catch(res => {
          uni.navigateBack()
        })
      },

      // 获取录取分数线
      getScoreLine(option) {
        if (!this.details.schoolName) {
          return
        }
        request({
          url: '/system/wx/CompassRecruitScore/list',
          token: true,
          not_loading: true,
          data: option ? Object.assign(option, {
            schoolName: this.details.schoolName
          }) : {
            schoolName: this.details.schoolName,
            admissionsAddress: '重庆'
          }
        }).then(res => {
          let {addressList, timesList, recruitScoreList, typeList, yearList} = res.data
          this.showData = recruitScoreList
          this.details.compassRecruitScoreList = recruitScoreList
          let admissionsTimesData = timesList.map(item => {
            return {dictValue: item}
          })
          let provinceNameData = addressList.map(item => {
            return {dictValue: item}
          })
          let wOrLData = typeList.map(item => {
            return {dictValue: item}
          })
          let yearData = yearList.map(item => {
            return {dictValue: item}
          })
          this.admissionsTimesData = admissionsTimesData
          this.provinceNameData = provinceNameData
          this.wOrLData = wOrLData
          this.yearData = yearData
        })
      },

      chooseBack(res) {
        let {wOrL, provinceName, year, admissionsTimes} = res
        if (wOrL && provinceName && year && admissionsTimes) {
          this.getScoreLine({
            admissionsAddress: provinceName,
            wOrL: wOrL || '',
            year: year || '',
            admissionsTimes: admissionsTimes || ''
          })
        }
      }
    },
    onShareAppMessage(res) {
      return {
        path: getCurrentFullPath()
      }
    }
  }
</script>

<style scoped lang="scss">
  $active_color: #2A6AAA;
  .wrapper {
    flex-direction: column;
    height: 100%;
    .top {
      position: relative;
      .bg {
        background-image: linear-gradient(rgb(39,148,217), rgb(156,210,244));
        height: 260upx;
        border-radius: 0 0 100upx 100upx;
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
      }
      .detail {
        width: 92%;
        margin: 0 auto;
        box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.4);
        border-radius: 16upx;
        z-index: 10;
        background: #fff;
        margin-top: 20upx;
        .title, .item {
          z-index: 1;
        }
        .school_icon {
          width: 150upx;
          height: 150upx;
          margin-right: 20upx;
          border-radius: 100%;
        }
      }
    }
    .empety {
      height: 20upx;
      background: #f7f7f7;
    }
    .swipper-wrp {
      flex: 1;
      .scroll_inner {
        width: 92%;
        margin: 0 auto;
        .title {
          padding-top: 20upx;
          .border {
            width: 4px;
            background: $active_color;
            margin-right: 20upx;
          }
        }
      }
    }

  }
</style>
